<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"   
      xmlns:jb="http://java.sun.com/jsf/composite/componentes"
      xmlns:p="http://primefaces.org/ui">


    <h:form onsubmit="return checkSubmit();"  id="frmPopupMatriz">

        <h:panelGrid styleClass="tabla_dinam" id="pgFormPopupMatriz"  frame="box" columns="1" cellspacing="5">
               <p:bubbleChart value="#{reportesCategoriaPecMBean.bubbleCategoriasModel}" bubbleGradients="true" shadow="true" title="MATRIZ DE KRAJLIC" 
                              showLabels="true"    bubbleAlpha="90"  yaxisLabel="Abastecimiento (Meses)" xaxisLabel="Presupuesto (Miles de Soles)" 
                                          xaxisAngle="50" yaxisAngle="50"  style="width:1200px;height:500px"  zoom="true"/>                         
               

               <p:bubbleChart rendered="false" value="#{reportesCategoriaPecMBean.bubbleCategoriasModel1}" bubbleGradients="true" shadow="true" title="Cuadrante I" 
                              showLabels="true"    bubbleAlpha="90"  yaxisLabel="Abastecimiento (Meses)" xaxisLabel="Presupuesto (Miles de Soles)" 
                                          xaxisAngle="50" yaxisAngle="50"  style="width:1150px;height:400px"  zoom="true"/>                         
                              
               <p:bubbleChart rendered="false" value="#{reportesCategoriaPecMBean.bubbleCategoriasModel2}" bubbleGradients="true" shadow="true" title="Cuadrante II" 
                                        showLabels="true" bubbleAlpha="90"  yaxisLabel="Abastecimiento (Meses)" xaxisLabel="Presupuesto (Miles de Soles)"
                                        xaxisAngle="50" yaxisAngle="50" style="width:1150px;height:400px"  zoom="true"/>                         
               
               <p:bubbleChart rendered="false" value="#{reportesCategoriaPecMBean.bubbleCategoriasModel3}" bubbleGradients="true" shadow="true" title="Cuadrante III" 
                                        showLabels="true" bubbleAlpha="90"  yaxisLabel="Abastecimiento (Meses)" xaxisLabel="Presupuesto (Miles de Soles)"
                                        xaxisAngle="50" yaxisAngle="50" style="width:1150px;height:400px"  zoom="true"/>                         
               
               <p:bubbleChart rendered="false" value="#{reportesCategoriaPecMBean.bubbleCategoriasModel4}" bubbleGradients="true" shadow="true" title="Cuadrante IV" 
                                        showLabels="true" bubbleAlpha="90"  yaxisLabel="Abastecimiento (Meses)" xaxisLabel="Presupuesto (Miles de Soles)"
                                        xaxisAngle="50" yaxisAngle="50" style="width:1150px;height:400px"  zoom="true"/>                         
               
        </h:panelGrid>  
     
    </h:form>
</html>